//创建Vue对象 接管页面
new Vue({
    el: "#app", //接管整个页面区域
    data: {
        userList: [],
        user: {},
        ids: []
    },
    methods: {
        //向服务器发送异步请求, 获取响应数据赋值userList
        findAll() {
            let _this = this;   //获取Vue对象
            /*
            * axios方法 和 说明
            * get(url?param=value):发送get异步请求，url:请求的服务器路径
            * then(function(resp){}):请求成功执行的方法，回调函数,resp:接收的是response对象
            *   响应的数据从response对象中去获取：rep.data
            * catch():请求失败执行的方法
            * finally():不管请求成功与否都执行的方法
            * */
            axios.get("/UserManager/user/list").then(function (resp) {
                //获取响应数据
                _this.userList = resp.data;
            }).catch(function (error) {
                alert("出错了哦: " + error);
            }).finally(function () {
                //alert("axios对象被调用");
            })
        },
        //根据id删除操作
        deleteByIds() {
            if (this.ids != null && this.ids.length > 0) {
                //发送get数据
                axios.get("/UserManager/user/delete?ids=" + this.ids).then(resp => {
                    this.findAll();
                    //清空ids数据
                    this.ids = [];
                });
            } else {
                alert("未选中任何用户! 请选择后再操作!");
            }
        },
        //打开新增页面
        openSave() {
            $("#myModal1").modal("show");
        },
        //实现新增功能  单击新增页面的保存  表单信息已经被双向绑定到user
        save() {
            //判空
            //使用post方式提交数据  需要使用转json
            axios.post("/UserManager/user/save", "user=" + JSON.stringify(this.user)).then(resp => {
                //刷新列表
                this.findAll();
                //清空user
                this.user = {};
            })
        },
        //实现更新操作
        update() {

            //使用axios的post方式提交数据
            axios.get("/UserManager/user/update?user="+JSON.stringify(this.user)).then(resp => {
                alert("修改成功!");
                //刷新列表
                this.findAll();
                //清空user
                this.user = {};
            });
        },
        findById(id) {
            //打开模态窗口
            $("#myModal").modal("show");
            //使用post方式提交id
            axios.post("/UserManager/user/findById", "uid=" + id).then(resp => {
                //返回数据
                //alert(resp.data);
                this.user = resp.data;
            })
        }

    },

    /*
        钩子函数 指定页面加载完成执行
     */
    created() {
        this.findAll();
    }
});